<template>
	<view>
		<view class="px-16 py-10 flex flex-column grid-gap-4  bg-white mt-12 ">
			<view class="p-12 rounded-4 border-grey-6">
				<textarea placeholder="输入你的意见" placeholder-class="fs-16" v-model="form.content"
					class="w-p-100 h-100"></textarea>
			</view>
			<view>
				<view class="mb-8">
					<text class="fs-16">添加照片</text>
					<text class="fs-13 text-grey-4">(限9张)</text>
				</view>
				<y-uploads :borderRadius='16' v-model="imageList"></y-uploads>
			</view>

		</view>
		<view class="px-16 mt-50">
			<view class=" rounded-30 w-p-100 bg-blue-1 text-white text-center py-8" @click="submit()">提交</view>
		</view>
		<y-loading v-if='show' overlay></y-loading>
	</view>
</template>

<script setup>
	import { ref } from 'vue';
	import { $http, $page, $tool } from '@/utils';
	const imageList = ref([])
	const show = ref(false)
	const form = ref({
		images: [],
		content: ''
	})

	const submit = () => {
		show.value = true
		if (imageList.value.length > 0) {
			imageList.value.forEach(item => {
				$http.upload('Upload/upload', { filePath: item, name: 'file' }).then(res => {
					form.value.images.push(res.data.url)
					if (form.value.images.length == imageList.value.length) {
						add()
					}
				}).catch(err => {
					show.value = false
				})
			})
		} else {
			add()
		}
	}
	const add = () => {
		$http.post('User/feedback', form.value).then(res => {
			$tool.toast(res.msg);
			setTimeout(() => {
				$page.back()
			}, 500)
			show.value = false
		}).catch(err => {
			show.value = false
		})
	}
</script>

<style>

</style>